import React, {useEffect, useState} from 'react';
import style from './index.module.scss';
import {Avatar, Button, Input, List, Space} from "antd";
import {LikeOutlined, MessageOutlined, StarOutlined} from "@ant-design/icons";

const data = Array.from({ length: 2 }).map((_, i) => ({
    href: 'https://ant.design',
    title: `ant design part ${i}`,
    avatar: 'https://joeschmoe.io/api/v1/random',
    description:
        'Ant Design, a design language for background applications, is refined by Ant UED Team.',
    content:
        'We supply a series of design principles, practical patterns and high quality design resources (Sketch and Axure), to help people create their product prototypes beautifully and efficiently.',
}));

const IconText = ({ icon, text }: { icon: React.FC; text: string }) => (
    <Space>
        {React.createElement(icon)}
        {text}
    </Space>
);

const Home = () => {
    const [state, setState] = useState([{
        imageUrl: 'https://www.azpay.cn/zb_users/upload/2021/01/202101190954477180384.png',
        tag: 1,
        title: '二次元个人主页html源码',
        subtitle: '二次元个人主页html源码 源码添加了layer弹出层，pc端以窗口显示，手机端直接打开新页面！ 修改说明：首页图片修改style.css文件第5行和146行图片链接进行更换！ 更换',
    }]);
    useEffect(() => {
        //请求首页数据

    }, [])
    return (
        <div className={style.home}>
            <div className={style.serchContainer}>
                <Input className={style.serchInput}/>
                <Button className={style.btn}>搜索</Button>
            </div>
            <List
                className={style.homeList}
                itemLayout="vertical"
                size="large"
                style={{
                    background: '#fff'
                }}
                dataSource={data}
                footer={
                    <div>
                        底部的footer
                    </div>
                }
                renderItem={item => (
                    <List.Item
                        key={item.title}
                        extra={
                            <img
                                width={272}
                                alt="logo"
                                src="https://gw.alipayobjects.com/zos/rmsportal/mqaQswcyDLcXyDKnZfES.png"
                            />
                        }
                    >
                        <List.Item.Meta
                            title="二次元个人主页html源码"
                            description="标签"
                        />
                        二次元个人主页html源码 源码添加了layer弹出层，pc端以窗口显示，手机端直接打开新页面！ 修改说明：首页图片修改style.css文件第5行和146行图片链接进行更换！ 更换
                    </List.Item>
                )}
            />
        </div>
    )
}
export default Home;